<template>
	<view class="top-window-header">
		<view class="left-header">
			<navigator class="logo" open-type="reLaunch" url="/pages/quality/sample/sample">
				<image src="../static/logo.png" mode="heightFix" ></image>
				<text>GMP-ERP系统</text>
			</navigator>
			<uni-icons type="left" size="30" style="padding-left: 30px;"></uni-icons>

			
		</view>
		<view class="right-header">
			<custom-tab-bar class="tab-bar-flex" direction="horizontal" :show-icon="false" :selected="current"
				@onTabItemTap="toSecondMenu" />

			<!-- #ifdef H5 -->		
			
			<!-- <uni-icons type="auth" size="30" @click="auth_click" ></uni-icons> -->
			<view class="right-header-item">
				<uni-icons class="auth" type="contact" size="20" @click="auth_click"></uni-icons>			
				<view @click="logout"><text>退出</text></view>
			</view>
			
			<!-- #endif -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
				selected: {
					quality: 0,
					API: 1,
					extUI: 2,
					template: 3
				},
				current: 0,
				indexPage: [{
					tabBar: '/pages/tabBar/quality/quality',
					index: '/pages/quality/sample/sample?lb=raw&sx=yp'
				}, {
					tabBar: '/pages/tabBar/API/API',
					index: '/pages/API/set-navigation-bar-title/set-navigation-bar-title'
				}, {
					tabBar: '/pages/tabBar/extUI/extUI',
					index: '/pages/extUI/badge/badge'
				}, {
					tabBar: '/pages/tabBar/template/template',
					index: '/pages/template/nav-button/nav-button'
				}]
			}
		},
		watch: {
			$route: {
				immediate: true,
				handler(newRoute) {
					const width = uni.getSystemInfoSync().screenWidth
					if (width >= 768) {
						let path = newRoute.path
						let comp
						if (path === '/') {
							comp = 'quality'
							path = '/pages/tabBar/quality/quality'
						} else {
							comp = path.split('/')[2]
						}
						
						this.current = this.selected[comp]
						for (const item of this.indexPage) {
							if (path === item.tabBar) {
								console.log(item.index)
								uni.redirectTo({
									url: item.index
								})
							}
						}
					}
				}
			}
		},
		mounted() {},
		methods: {
			toSecondMenu(e) {
				
				const activeTabBar = '/' + e.pagePath
				for (const item of this.indexPage) {
					if (activeTabBar === item.tabBar) {
						console.log('top2',item.index)
						uni.redirectTo({
							url: item.index
						})
					}
				}
			},
			auth_click(){
				uni.navigateTo({
					url: '/pages/login/usercenter'
				});
			},
			logout() {
			  // 处理退出登录逻辑
			  uni.showModal({
			    title: '提示',
			    content: '确定要退出登录吗？',
			    success: (res) => {
			      if (res.confirm) {
			        // 清除用户信息和状态
			        uni.clearStorageSync();
			        // 跳转到登录页面
			        uni.redirectTo({
			          url: '/pages/login/login'
			        });
			      }
			    }
			  });
			}
		}
	}
</script>

<style lang="scss">
	.top-window-header {
		height: 40px;
		padding: 0 15px;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		box-sizing: border-box;
		border-bottom: 1px solid #e1e1e1;
		background-color: #FFFFFF;
		color: #333;
		.left-header{
			display: flex;
			flex-direction: row;
			align-items: center;
			flex: 1;
			.logo {
				image {
					height: 30px;
					width: 30px;
				}
				text {
					margin-left: 8px;
				}
			}
		}
	}

	

	

	

	.right-header {
		display: flex;
		flex-direction: row;
		color: #333;
		margin-top: 20px;
		.tab-bar-flex{
			width: 360px;
		}
		.right-header-item {
			display: flex;
			flex-direction: row;
			font-size: 14px;
			color: #666;
			.auth{
				padding-left: 10px;
				padding-right: 5px;
				padding-bottom: 5px;
			}
		}
	}

	

	// .active {
	// 	color: #4cd964;
	// 	border-bottom: 2px solid;
	// }

	

	
	
	
	
</style>
